import React, { useState,useEffect } from "react";
import classNames from "classnames";
import {Popup} from 'antd-mobile'
import './style.css'
import Carousel from "@/components/common/carousel";

export default function GoodsCard({source}) {
    const {imgs,title,com_count,comment,price,discount_price} = source
    const [showTab,setShowTab] = useState(false)
    // useEffect(()=>{
    //     setTimeout(()=>{
    //         setShowTab(true)
    //     },2000)
    // },[])
    return (
        <div className="goods-wrapper">
            <Carousel imgs={imgs} />
            <div className="content">
                <div className="comment-wrapper">
                    <div className="comment-box">
                        <div className="count">{com_count}</div>
                        <div >评价</div>
                    </div>
                    <div className="comment">
                            {comment}
                    </div>
                </div>

                <div className="goods-title-wrapper">
                    <div className="goods-title">{title}</div> <div className="goods-arrow">&gt;</div>
                </div>

            </div>
            <Popup
                visible={showTab}
                onMaskClick={() => {setShowTab(false)}}
                bodyStyle={{ height: "90vh" }}
                >
                    <div>popup</div>
            </Popup>
        </div>
    )
}
